<template>
	<view>
		<view style="display: flex; justify-content: flex-start; align-items: center; margin-top: 160rpx;">
			<image src="../../static/logo.png"
				style="height: 60rpx; width: 60rpx; border-radius: 30rpx; margin-left: 10rpx;"></image>
			<view style="width: 300rpx;">
				<u-tabs :font-size="25" active-color="#303133" inactive-color="#606266" :list="list" :current="current"
					@change="change"></u-tabs>
			</view>
			<view>
				<u-input placeholder="请输入内容" :border="true" />
			</view>
			<view style="margin-left: 6rpx; font-size: 40rpx; margin-right: 10rpx;" class="cuIcon-search"></view>
		</view>

		<view style="margin-top: 20rpx; display: flex; justify-content: flex-start; flex-wrap: wrap;">
			<view style="height: 500rpx; box-shadow: 0px 2px 5px #f2f6fc; border-radius: 10rpx; width: 360rpx; margin-top: 10rpx; margin-left: 10rpx;">
				<image mode="aspectFill" style="width: 360rpx; border-radius: 10rpx; height: 380rpx;"
					src="https://img2.baidu.com/it/u=4110627428,1113908428&fm=253&fmt=auto&app=138&f=JPEG?w=640&h=427">
				</image>
				<view style="display: flex; justify-content: space-between; align-items: center; margin-top: 20rpx;">
					<image src="../../static/logo.png" style="height: 60rpx; width: 60rpx; border-radius: 30rpx; margin-left: 15rpx;">
					</image>
					<view style="display: flex; width: 120rpx; justify-content: space-between; margin-right: 15rpx;">
						<view class="cuIcon-like"></view>
						<view class="cuIcon-message"></view>
						<view class="cuIcon-share"></view>
					</view>
				</view>
			</view>
			
		</view>
		
		<view style="position: fixed; z-index: 9999; width: 80rpx; height: 80rpx; border-radius: 40rpx; box-shadow: 2px 2px 5px #f2f6fc; display: flex; justify-content: center; align-items: center; right: 30rpx; bottom: 20rpx;">
			<view class="cuIcon-camera" style="font-size: 60rpx;"></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
					name: '关注'
				}, {
					name: '发现'
				}, {
					name: '本地'
				}],
				current: 0
			}
		},
		methods: {
			change(index) {
				this.current = index;
			},
		}
	}
</script>

<style>

</style>
